<template>
  <div :style="{display:is_show?'':'none'}">
    <div class="weui-mask" @click.stop="$emit('on-mask')">
    </div>
    <div class="weui-dialog" :style="{display:is_empty?'none':'',maxWidth:width?width+'px':''}"
         @click.stop="$emit('on-dialog')">
      <div class="weui-dialog__hd">
        <strong class="weui-dialog__title">
          {{title}}
        </strong>
      </div>
      <div class="weui-dialog__bd">
        <slot>
        </slot>
      </div>
      <div class="weui-dialog__ft">
        <a href="javascript:;" class="weui-dialog__btn" v-for="(item, index) in list" @click="$emit('on-click', index)"
           :class="{'weui-dialog__btn_default':index!=list.length-1, 'weui-dialog__btn_primary':index==list.length-1}">
          {{item}}
        </a>
      </div>
    </div>
  </div>
</template>

<script>
  export default {
    props: {
      is_show: {
        type: Boolean,
        default: true
      },
      is_empty: {
        type: Boolean,
        default: false
      },
      title: {
        type: String,
        default: '我是title'
      },
      list: {
        type: Array,
        default() {
          return ['list0', 'list1']
        }
      },
      width: {
        type: Number,
        default: 0
      }
    }
  }
</script>

<style>
  @import '~weui/dist/style/weui.min.css';
</style>
